<template>
	<view>
		<uni-card>
			<uni-row>
				<uni-col :span="6"  >
					<h4>奖励模板</h4>
				</uni-col>
			</uni-row>
			<uni-row>
				<view style="margin-top: 20rpx;margin-bottom: 20rpx;">
					<uni-col :span="6" :offset="1">
						<uni-tag  color="#6878F8" text="爱学习" type="royal"></uni-tag>
					</uni-col>
					<uni-col :span="6" :offset="1">
						<uni-tag color="#6878F8" text="爱运动" type="royal"></uni-tag>
					</uni-col>
				</view>
			</uni-row>
		</uni-card>
		
		<uni-card>
			<view>
				<uni-row style="margin-bottom: -20rpx;">
					<uni-col :span="6"  >
						<h4>评价</h4>
					</uni-col>
				</uni-row>
				<uni-row>
					<view style="margin-top: 40rpx;">
						<uni-col :span="24" >
							<uni-easyinput style="border: none;" type="textarea" placeholder="阅读能有效提高学生的文学素养" ></uni-easyinput>
						</uni-col>
					</view>
				</uni-row>
				<uni-row style="margin-top: 20rpx;">
					<view style="font-size: 14rpx;">
					<uni-col :span="4">
						<uni-row>
							<uni-col :span="20">
								<uni-icons type="mic" size="25"></uni-icons>
							</uni-col>
						</uni-row>
						<uni-row>
							<uni-col :span="22" >
								<text>语音</text>
							</uni-col>
						</uni-row>
					</uni-col>
					<uni-col :span="4">
						<uni-row>
							<uni-col :span="20">
								<uni-icons type="image" size="25"></uni-icons>
							</uni-col>
						</uni-row>
						<uni-row>
							<uni-col :span="22" >
								<text>图片</text>
							</uni-col>
						</uni-row>
					</uni-col>
					<uni-col :span="4">
						<uni-row>
							<uni-col :span="20">
								<uni-icons type="upload" size="25"></uni-icons>
							</uni-col>
						</uni-row>
						<uni-row>
							<uni-col :span="22" >
								<text>文件</text>
							</uni-col>
						</uni-row>
					</uni-col>
					<uni-col :span="4">
						<uni-row>
							<uni-col :span="20">
								<uni-icons type="paperclip" size="25"></uni-icons>
							</uni-col>
						</uni-row>
						<uni-row>
							<uni-col :span="22" >
								<text>链接</text>
							</uni-col>
						</uni-row>
					</uni-col>
					
					<uni-col :span="4" :offset="4">
						<uni-row>
							<uni-col :span="20">
							</uni-col>
						</uni-row>
						<uni-row style="margin-top: 50rpx;">
							<uni-col :span="22" >
								<text>20/1000</text>
							</uni-col>
						</uni-row>
					</uni-col>
					</view>
				</uni-row>
			</view>
		</uni-card>
		
		
		<uni-card>
	
			<uni-row>
				<uni-col :span="2"  >
					<view style="margin-top: -3rpx;">
						<uni-icons type="star" color="#6878F8" size="18"></uni-icons>
					</view>
				</uni-col>
				<uni-col :span="14" >
					<view style="color: #777575;">
					<h4>奖励细则（可选择性填写）</h4>
					</view>
				</uni-col>
				<uni-col :span="4"  :offset="4">
					<view style="color: #6878F8;">
						<h4 >修改</h4>
					</view>
				</uni-col>
			</uni-row>
		</uni-card>
		<uni-card style="margin-top: -30rpx ;">
		<uni-row>
			<view>
				<uni-row>
					<uni-col :span="6" >
							<view style="font-weight: 600;">
								<text>奖励类别</text>
							</view>
					</uni-col>
					<uni-col :span="4" :offset="13">
						<picker :value="index" :range="array" @change="bindPickerChange">
							<view  style="font-weight: 600;color:#6878F8 ;">{{array[index]}}</view>
						</picker>
					</uni-col>
					<uni-col :span="1" >
							<view style="font-weight: 600;">
								<uni-icons type="right" color="#6878F8" size="18"></uni-icons>
							</view>
					</uni-col>
				</uni-row>
			</view>
		</uni-row>
		</uni-card>
		
		<uni-card style="margin-top: -30rpx ;">
		<uni-row>
			<view>
				<uni-row>
					<uni-col :span="6" >
							<view style="font-weight: 600;">
								<text>奖励</text>
							</view>
					</uni-col>
					<uni-col :span="4" :offset="13">
						<picker :value="index" :range="array1" @change="bindPickerChange1">
							<view  style="font-weight: 600;color:#6878F8 ;">{{array1[index1]}}</view>
						</picker>
					</uni-col>
					<uni-col :span="1" >
							<view style="font-weight: 600;">
								<uni-icons type="right" color="#6878F8" size="18"></uni-icons>
							</view>
					</uni-col>
				</uni-row>
			</view>
		</uni-row>
		</uni-card>
		<uni-card style="margin-top: -30rpx ;">
		<uni-row>
			<view>
				<uni-row>
					<uni-col :span="6" >
							<view style="font-weight: 600;">
								<text>奖励指标</text>
							</view>
					</uni-col>
					<uni-col :span="6" :offset="11">
						<picker :value="index" :range="array2" @change="bindPickerChange2">
							<view  style="font-weight: 600;color:#6878F8 ;">{{array2[index2]}}</view>
						</picker>
					</uni-col>
					<uni-col :span="1" >
							<view style="font-weight: 600;">
								<uni-icons type="right" color="#6878F8" size="18"></uni-icons>
							</view>
					</uni-col>
				</uni-row>
			</view>
		</uni-row>
		</uni-card>
		<uni-card style="margin-top: -30rpx ;">
		<uni-row>
			<view>
				<uni-row>
					<uni-col :span="6" >
							<view style="font-weight: 600;">
								<text>数量</text>
							</view>
					</uni-col>
					<uni-col :span="4" :offset="13">
						<picker :value="index" :range="array3" @change="bindPickerChange3">
							<view  style="font-weight: 600;color:#6878F8 ;">{{array3[index3]}}</view>
						</picker>
					</uni-col>
					<uni-col :span="1" >
							<view style="font-weight: 600;">
								<uni-icons type="right" color="#6878F8" size="18"></uni-icons>
							</view>
					</uni-col>
				</uni-row>
			</view>
		</uni-row>
		</uni-card>
		
		<uni-row>
			<uni-col :span="20"  :offset="2">
				<button type="primary" @click="goto('/')">提交</button>
			</uni-col>
		</uni-row>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				  array: ['德', '智', '体', '美', '劳'],
				   array1: ['金', '银', '铜'],
				   array2: ['举止文明', '爱护花草', '乐于助人'],
				   		   array3: [1,2,3,4,5],
				            index: 0,
							 index1: 0,
							  index2: 0,
							   index3: 0,
			}
		},
		onLoad() {

		},
		methods: {
		 bindPickerChange: function(e) {
			},
			bindPickerChange1: function(e) {
						},
						bindPickerChange2: function(e) {
									},
									bindPickerChange3: function(e) {
												},
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
